
<template>
  <view class="container">
    <z-nav-bar id="nav" bgColor="#ffffff" title="选择开卡类型"></z-nav-bar>
    <view class="content">
      <view class="card" @click="handleCardClick('A')">
        <view class="card-icon enterprise">
          <image src="../static/icon/icon_man.png" mode="widthFix"></image>
<!--          <uni-icons type="staff" size="24" color="#1890FF"></uni-icons>-->
        </view>
        <text class="card-text">企业团体卡</text>
      </view>
      <view class="card" @click="handleCardClick('B')">
        <view class="card-icon family">
          <image src="../static/icon/icon_man_more.png" mode="widthFix"></image>
<!--          <uni-icons type="person" size="24" color="#FF4D4F"></uni-icons>-->
        </view>
        <text class="card-text">家庭团体卡</text>
      </view>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { onLoad } from '@dcloudio/uni-app';
import { ref } from 'vue'
const storeId= ref<any>('');
const handleCardClick = (type: 'A' | 'B') => {
  let url =storeId ?`/pagesMy/user/openTeam?groupCardType=${type}&storeId=${storeId.value}`:`/pagesMy/user/openTeam?groupCardType=${type}&storeId=${storeId.value}`
  uni.navigateTo({
    url
  });
};
onLoad((e)=>{
  if(e.storeId){
    storeId.value = e.storeId
  }
})
</script>

<style>
page {
  height: 100%;
}

.container {
  height: 100%;
  background-color: #FFFFFF;
  padding: 0 30rpx;
}



.content {
  padding-top: 20rpx;
}

.card {
  display: flex;
  align-items: center;
  height: 108rpx;
  background-color: #F5F5F5;
  border-radius: 12rpx;
  margin-bottom: 20rpx;
  padding: 0 30rpx;
}

.card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48rpx;
  height: 48rpx;
  margin-right: 20rpx;
  >image{
    width: 48rpx;
    height: 48rpx;
  }
}

.card-text {
  font-size: 14px;
  color: #333333;
}
</style>

